<template>
  <van-collapse-item title="会议材料" name="meetingMaterial">
    <div class="card-container">

      <van-field readonly label="会场照片">
        <template #input>
          <base-upload
            multiple
            :model-value="params.photo"
            @uploadSucc="uploadSuccess"
            @deleteFile="deleteFile"
            type="15"
            :maxFileCount="1000"
          ></base-upload>
        </template>
      </van-field>

      <van-field readonly label="签到表">
        <template #input>
          <base-upload
            multiple
            :model-value="params.signIn"
            @uploadSucc="signInUploadSuccess"
            @deleteFile="signInDeleteFile"
            type="16"
            :maxFileCount="1000"
          ></base-upload>
        </template>
      </van-field>
    </div>
  </van-collapse-item>
  
</template>

<script setup>
  import { reactive, watch } from 'vue'

  const emits = defineEmits(['submit'])
  const params = reactive({
    photo: [],
    signIn: []
  });

  watch([
    () => params.photo,
    () => params.signIn
  ], () => {
    emits('submit')
  }, { deep: true })

  function uploadSuccess (val) {
    val.url = `//${val.url}`
    params.photo.push(val)
  }
  function deleteFile (val) {
    const fileIndex = params.photo.findIndex(item => item.fileId == val.fileId)
    params.photo.splice(fileIndex, 1)
  }
  function signInUploadSuccess (val) {
    val.url = `//${val.url}`
    params.signIn.push(val)
  }
  function signInDeleteFile (val) {
    const fileIndex = params.signIn.findIndex(item => item.fileId == val.fileId)
    params.signIn.splice(fileIndex, 1)
  }

  defineExpose({
    getParams () {
      const attach = [
        ...(params.photo.map(item => item.fileId)),
        ...(params.signIn.map(item => item.fileId)),
      ]
      return attach;
    },
    setParams (detail) {
      const attach = detail.meetingFiles || []
      params.photo = [];
      params.signIn = [];

      attach.forEach(item => {
        switch (item.type) {
          case 15:
            params.photo.push({
              url: `//${item.fileVisitPath}`,
              fileId: item.id
            })
            break;
          case 16:
            params.signIn.push({
              url: `//${item.fileVisitPath}`,
              fileId: item.id
            })
            break;
        }
      })
    }
  })

</script>